import React, { Component } from "react";

import "./css/index.css";

export default class App extends Component {
  render() {
    let msg = "hello world";
    const obj = {
      background: "yellow",
      fontSize: 30,
      color: "red",
    };
    return (
      <div>
        <div>
          {10 + 20}
          {/* 10+20 */}
        </div>
        <div>{msg}</div>
        <div style={obj}>{10 > 20 ? "aaa" : "bbb"}</div>
        <div style={{ background: "blue" }}>1111</div>
        <div className="active">2222222</div>
        <div id="myapp">3333333</div>

        {/* react 推荐使用行内样式，因为react 每个组件都是一个独立的整体 */}

        <div>
          <label htmlFor="username">用户名：</label>
          <input type="text" id="username" name="username" />
        </div>
      </div>
    );
  }
}
